import React from 'react'
import type { MenuProps } from 'antd';
// import { LaptopOutlined, NotificationOutlined, UserOutlined } from '@ant-design/icons';
import { Breadcrumb, Layout, Menu, theme, Divider, ConfigProvider } from 'antd';

const { Content, Sider } = Layout;

// const items2: MenuProps['items'] = [UserOutlined, LaptopOutlined, NotificationOutlined].map(
//     (icon, index) => {
//       const key = String(index + 1);
//       return {
//         key: `sub${key}`,
//         icon: React.createElement(icon),
//         label: `subnav ${key}`,

//         children: new Array(4).fill(null).map((_, j) => {
//           const subKey = index * 4 + j + 1;
//           return {
//             key: subKey,
//             label: `option${subKey}`,
//           };
//         }),
//       };
//     },
//   );

const Index = (props: any) => {
  const { ldTheme } = props
  const {
    token: { colorBgContainer },
  } = theme.useToken();
  return <Layout >
    <Sider width={200} style={{ background: ldTheme === 'light' ? '#f5f5f5' : '#141414', borderRight: '1px #e7e7e7 solid' }}>
      {/* <Menu
        mode="inline"
        defaultSelectedKeys={['1']}
        defaultOpenKeys={['sub1']}
        style={{ height: '100%', borderRight: 0 }}
        items={items2}
      /> */}
    </Sider>
    <Layout style={{}}>
      
        <Content
          style={{
            padding: 24,
            margin: 0,
            minHeight: 280,
            background: ldTheme === 'light' ? '#f5f5f5' : '#141414',
            color:ldTheme === 'light' ? 'black' : 'white',
          }}
        >
          Content
        </Content>
    </Layout>
  </Layout>
}

export default Index